@import '../../var';

.loading-screen {
  color: $light;
  width: 640px;
  height: 400px;

  background-color: #000;
  background-position: top right;
  background-size: cover;
  background-repeat: no-repeat;
  background-blend-mode: normal;
  -webkit-font-smoothing: subpixel-antialiased;
  .loading-screen-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba($color: $text, $alpha: 0.9);

    button {
      position: absolute;
      bottom: 10px;
      right: 10px;
      background-color: transparent;
      color: $white-ter;
      border-color: $white-ter;
    }
  }

  .loading-message {
    width: 500px;
    padding: 10px;
    font-size: $size-medium;
    color: $white-ter;
    line-height: 1.5em;
    min-height: 7em;
    display: flex;
    align-items: center;
    // max-height: 180px;
    // overflow: hidden;
    // height: 100%;
    // display: flex;
    // flex-direction: column;
    // justify-content: center;
  }
  .progress {
    height: 3px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
  }
}
